﻿<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
    <title>FooTable - jQuery plugin for responsive HTML tables</title>
    <meta name="viewport" content="width = device-width, initial-scale = 1.0, minimum-scale = 1.0, maximum-scale = 1.0, user-scalable = no"/>
	<link href="../css/bootstrap.css" rel="stylesheet" type="text/css"/>
	<link href="../../css/footable.core.css" rel="stylesheet" type="text/css"/>
    <link href="../css/footable-demos.css" rel="stylesheet" type="text/css"/>
    <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js" type="text/javascript"></script>
    <script>
        if (!window.jQuery) { document.write('<script src="../js/jquery-1.9.1.min.js"><\/script>'); }
    </script>
    <script src="../../js/footable.js" type="text/javascript"></script>
	<script src="../js/bootstrap-tab.js" type="text/javascript"></script>
    <script src="../js/demos.js" type="text/javascript"></script>
</head>
<body>
	<div class="demo-container">
        <ul class="breadcrumb">
            <li><a href="http://fooplugins.com/plugins/footable-jquery/-jquery/">FooTable</a> <span class="divider">&raquo;</span></li>
            <li><a href="../index.htm">Demos</a> <span class="divider">&raquo;</span></li>
        </ul>
        <table class="table table-striped">
            <thead>
            <tr>
                <th>Invoice no.</th>
                <th>Date</th>
                <th>Amount</th>
                <th>CUR</th>
                <th data-hide="phone" data-ignore="true">Type</th>
            </tr>
            </thead>
            <tbody>
            <tr>
                <td><a href="#">2107052244</a></td>
                <td>02/15/2011</td>
                <td data-value="20000000">&euro;20,000,000.00</td>
                <td>EUR</td>
                <td>Standard invoice</td>
            </tr>
            </tbody>
        </table>
	</div>
    <script type="text/javascript">
        $(function () {
            $('table').footable({
                delay: 50,
                breakpoints: {
                    tablet: 800,
                    phone: 480
                }
            });
        });
    </script>
</body>
</html>
